<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      div {
        border-radius: 50%;
        transform: scale(0.5);
      }
    </style>
  </head>
  <body></body>
  <script>
    //   对嵌套对象进行解构
    let user = {
      name: "xiaohui",
      head: { eyes: 2, mouse: 1 },
    };
    let {
      name,
      head: { eyes },
    } = user;
    console.log(eyes);

    // 解构默认值
    function createElement(params) {
      let { width = 200, height = 100, background = "blue" } = params;
      /**
      *1:使用createElement创建一个div标签
      *2:使用style给div标签添加样式
      *3:使用appendChild把创建的div节点添加到body上
      */
      const div = document.createElement("div");
      div.style.width = width + "px";
      div.style.height = height + "px";
      div.style.backgroundColor = background;
      document.body.appendChild(div);
      console.log(width);
    }
    createElement({ width: 300, height: 300, background: "#5698c3" });
  </script>
</html>
